<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>商品列表 - 校园二手市场</title>
    <meta name="description" content="校园二手交易平台发布商品">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
    <link rel="stylesheet" href="css/publish.css">
</head>
<body>
     <!-- 导航栏 -->
     <header class="header">
        <div class="container">
            <a href="index.html" class="logo">
                <img src="images/logo.png" class="logo_img" alt="校园二手市场">
                <span>校园二手市场</span>
            </a>

            <nav class="nav">
                <a href="index.html" ><i class="fas fa-home"></i> 首页</a>
                <a href="products.html"><i class="fas fa-list"></i> 商品</a>
                <a href="cart.html"><i class="fas fa-shopping-cart"></i> 购物车</a>
                <a href="publish.html" class="active"><i class="fas fa-plus-circle"></i> 发布</a>
                <a href="login.html" id="auth-link">
                    <img id="user-avatar" src="" alt="用户头像" class="user-avatar">
                    <span id="auth-text">登录/注册</span>
                </a>
            </nav>

            <button class="mobile-menu-btn" id="mobile-menu-btn">
                <i class="fas fa-bars"></i>
            </button>
        </div>
    </header>


  <!-- 主内容区 -->
  <main>
    <div>
        <h1>发布商品</h1>

        <form id="product-form" action="#" method="POST" enctype="multipart/form-data">
            <!-- 商品基本信息 -->
            <div>
                <label for="name">商品名称 <span>*</span></label>
                <input type="text" id="name" name="name" required maxlength="200">

                <label for="price">商品价格（元） <span>*</span></label>
                <input type="number" id="price" name="price" min="0" step="0.01" required>

                <label for="originalPrice">原始价格（元） <span>*</span></label>
                <input type="number" id="originalPrice" name="originalPrice" min="0" step="0.01" required>

                <label for="categoryId">商品分类 <span>*</span></label>
                <select id="categoryId" name="categoryId" required>
                    <option value="">请选择分类</option>
                    <option value="1">电子数码</option>
                    <option value="2">书籍教材</option>
                    <option value="3">衣物鞋包</option>
                    <option value="4">运动健身</option>
                    <option value="5">生活用品</option>
                    <option value="6">其他</option>
                </select>

                <label for="stock">商品库存 <span>*</span></label>
                <input type="number" id="stock" name="stock" min="0" required>

                <label for="status">商品状态 <span>*</span></label>
                <select id="status" name="status" required>
                    <option value="">请选择状态</option>
                    <option value="1">全新</option>
                    <option value="2">99新</option>
                    <option value="3">9成新</option>
                    <option value="4">8成新</option>
                    <option value="5">7成新及以下</option>
                </select>
            </div>

            <!-- 商品详细信息 -->
            <div>
                <label for="description">商品描述</label>
                <textarea id="description" name="description" maxlength="1000" rows="4"></textarea>

                <label for="tags">商品标签</label>
                <input type="text" id="tags" name="tags" maxlength="200" placeholder="例如：99新,包邮,可议价">

                <label for="location">地理位置</label>
                <input type="text" id="location" name="location" maxlength="200" placeholder="例如：XX大学XX校区">

                <label for="attributes">商品属性</label>
                <input type="text" id="attributes" name="attributes" maxlength="1000" placeholder="例如：尺寸:M;颜色:蓝色;材质:棉质">

                <label for="expireTime">过期时间</label>
                <input type="date" id="expireTime" name="expireTime">

                <label for="images">商品图片</label>
                <input type="file" id="images" name="images" multiple accept="image/*">
            </div>

            <!-- 提交按钮 -->
            <div>
                <button type="submit">发布商品</button>
                <button type="reset">重置</button>
            </div>
        </form>
    </div>
</main>

<!-- 页脚 -->
<footer>
    <div>
        <p>© 2025 校园二手市场 - 让闲置物品重新流通</p>
        <p>联系方式: support@campusmarket.com</p>
    </div>
</footer>

<!-- 脚本 -->
<script src="js/api.js"></script>
<script src="js/common.js"></script>
<script src="js/publish.js"></script>
</body>
</html>